<!DOCTYPE html>
<html>
<include file="Public:header" />
<link href="__ACSS__/dialog.css" rel="stylesheet">
<link href="__ACSS__/plugins/validform/validform.css" rel="stylesheet">
<style>
	.form-control{ padding-left:5px;}
	.upload-warp{ position:relative;}
	.upload-btn{ position:absolute; top:0; right:0; border-radius:0;}
	
	.file-preview {border:1px solid #ddd; padding:5px; width:100%; margin-bottom:5px;}
	.file-preview-frame{ margin:8px; border:1px solid #ddd; box-shadow:1px 1px 5px 0px #a2958a; padding:6px; float:left; text-align:center; vertical-align:middle;}
	.file-preview-frame .btn{ float:right; margin-top:5px;}
	.file-preview-text{ color:#428bca; font-size:11px; text-align:center;}
	
	.purchase-box{ width:90%;}
	.purchase-box span{ border:1px solid #ddd; padding:3px 10px; border-radius:4px; float:left; background:#fff; font-size:15px; position:relative; cursor:pointer; margin:0 10px 10px 0;}
	.purchase-box span i{ margin-left:8px; color:#888;}
	.purchase-box span:hover{ border:1px solid #999; background:#eee;}
</style>
  <body>
	  <div class="wrapper wrapper-content animated fadeInRight">
		<form role="form" class="form" action="__URL__/update">
			<input type="hidden" name="update_time" value="<php>echo time();</php>">
			<input type="hidden" name="id" value="<{$vo.id}>">
			<div class="form-group">
				<label class="col-sm-2 control-label">标题：</label>
				<div class="col-sm-10">
					<input type="text" datatype="*" name="title" value="<{$vo.title}>" class="form-control" placeholder="标题">
				</div>
			</div>
			<div class="form-group">
				<label class="col-sm-2 control-label">类型：</label>
				<div class="col-sm-10">
					<label class="radio-inline">
						<input type="radio" <if condition="$vo.type eq 2"> checked</if> name="type" value="2"> 有链接
					</label>
					<label class="radio-inline">
						<input type="radio" <if condition="$vo.type eq 1"> checked</if> name="type" value="1"> 无链接
					</label>
					<label class="radio-inline">
						<input type="radio" <if condition="$vo.type eq 3"> checked</if> name="type" value="3"> 会场
					</label>
					<label class="radio-inline">
						<input type="radio" <if condition="$vo.type eq 4"> checked</if> name="type" value="4"> 充值广告
					</label>
					<label class="radio-inline">
						<input type="radio" <if condition="$vo.type eq 5"> checked</if> name="type" value="5"> 活动专场
					</label>
					<label class="radio-inline">
						<input type="radio" <if condition="$vo.type eq 6"> checked</if> name="type" value="6"> 产品
					</label>
				</div>
			</div>
			<div class="clearfix"></div>
			<br/>
			<div class="form-group url-box">
				<label class="col-sm-2 control-label">URL：</label>
				<div class="col-sm-10">
					<input type="text" name="url" value="<{$vo.url}>" datatype="*" id="url" class="form-control" placeholder="链接">
					<span class="Validform_checktip"></span>
				</div>
			</div>
			<div class="form-group meetingplace-box">
				<label class="col-sm-2 control-label">选择会场/产品：</label>
				<div class="col-sm-10">
					<div class="upload-warp">
						<div class="purchase-box">                                                                    
							<if condition="($vo['type'] eq '3') OR ($vo['type'] eq '5') OR ($vo['type'] eq '6')">
								<span ref="<{$vo.url}>" onclick="checkDel(this)"><{$vo.name}><i class="fa fa-times"></i></span>
							</if>
						</div>
						<button type="button" class="btn btn-primary upload-btn select-btn">&nbsp;选择&nbsp;</button>
					</div>
					<input type="hidden" name="url" value="<{$vo.url}>" datatype="*" id="ambulance" class="form-control" placeholder="链接">
					<div class="clearfix"></div>
				</div>
				<div class="clearfix"></div>
			</div>
			<div class="form-group">
				<label class="col-sm-2 control-label">网站焦点图：</label>
				<div class="col-sm-10">
					<div class="file-preview">
					    <div class="file-preview-thumbnails" data-num="1">
							<div class="file-preview-frame">
								<span class="file-preview-image"><img src="__IMGROOT__<{$vo.img_web}>" rel="<{$vo.img_web}>" ref="<{$vo.img_web}>" class="file-preview-image"></span>
								<div class="clearfix"></div><button onclick="delPhoto(this)" type="button" class="btn btn-xs btn-white"><i class="glyphicon glyphicon-trash text-danger"></i></button>
							</div>
						</div>
					    <div class="clearfix"></div>
					</div>
					<div class="upload-warp">
	                	<input class="form-control localname" type="text" placeholder="尺寸为420px*1920px 200kb左右" datatype="*" value="<{$vo.img_web}>" nullmsg="请上传图片" errormsg="请上传图片" readonly="readonly">
	                	<button type="button" onclick="doUpload(this)" class="btn btn-primary upload-btn"><i class="glyphicon glyphicon-folder-open"></i>&nbsp;&nbsp;选择&nbsp;...</button>
	               		<input type="hidden" value="<{$vo.img_web}>" name="img_web" class="head_picture"/>
               		</div>
				</div>
			</div>
			<div class="form-group">
				<label class="col-sm-2 control-label">APP焦点图：</label>
				<div class="col-sm-10">
					<div class="file-preview">
					    <div class="file-preview-thumbnails" data-num="1">
							<div class="file-preview-frame">
								<span class="file-preview-image"><img src="__IMGROOT__<{$vo.img_app}>" rel="<{$vo.img_app}>" ref="<{$vo.img_app}>" class="file-preview-image"></span>
								<div class="clearfix"></div><button onclick="delPhoto(this)" type="button" class="btn btn-xs btn-white"><i class="glyphicon glyphicon-trash text-danger"></i></button>
							</div>
						</div>
					    <div class="clearfix"></div>    
					</div>
					<div class="upload-warp">
	                	<input class="form-control localname" type="text" placeholder="尺寸为450px*750px 120kb左右" value="<{$vo.img_app}>" readonly="readonly">
	                	<button type="button" onclick="doUpload(this)" class="btn btn-primary upload-btn"><i class="glyphicon glyphicon-folder-open"></i>&nbsp;&nbsp;选择&nbsp;...</button>
	               		<input type="hidden" name="img_app" value="<{$vo.img_app}>" class="head_picture"/>
               		</div>
				</div>
			</div>
			<div class="clearfix"></div>
			<br/>
			<div class="clearfix">
				<button type="submit" id="submit" class="btn btn-success btn-block">提交</button>
				<button type="reset" id="reset2" class="hidden btn btn-success btn-block">重置</button>
			</div>
		</form>
	  </div>
  </body>
<!-- 全局js -->
<include file="Public:foot" />
<script src="__AJSPLUGINS__/validform/Validform_v5.3.2_min.js"></script>
<!-- Uploader -->
<script type="text/javascript" src="__AJS__/jquery.upload.js"></script>
<script>
function doUpload(t) {
	$.upload({
	        url: '__URL__/uploadImg', 
	        fileName: 'filedata', 
	        dataType: 'json',
	        acceptType:'image/jpeg,image/png',
	        params: {name: 'head_picture'},
	        onSend: function() {
	                return true;
	        },
	        // 上传之后回调
	        onComplate: function(data) {
	        	if(data.err.length == 0){
		        	var url = data.msg.url;
		        	if($(t).parents(".form-group").find(".file-preview-thumbnails").attr("data-num") == 1) {
	        			$(t).parents(".form-group").find(".file-preview-thumbnails").html('<div class="file-preview-frame"><span class="file-preview-image"><img style="width:150px;" class="file-preview-image" ref="'+ data.msg.localname  +'" rel="'+ url  +'" src=__IMGROOT__'+ url +'></span><div class="clearfix"></div><button class="btn btn-xs btn-white" type="button" onclick="delPhoto(this)"><i class="glyphicon glyphicon-trash text-danger"></i></button></div>');
	        		}else if($(t).parents(".form-group").find(".file-preview-thumbnails").attr("data-num") > 1) {
	        			$(t).parents(".form-group").find(".file-preview-thumbnails").append('<div class="file-preview-frame"><span class="file-preview-image"><img style="width:150px;" class="file-preview-image" ref="'+ data.msg.localname  +'" rel="'+ url  +'" src=__IMGROOT__'+ url +'></span><div class="clearfix"></div><button class="btn btn-xs btn-white" type="button" onclick="delPhoto(this)"><i class="glyphicon glyphicon-trash text-danger"></i></button></div>');
	        		}
	        		initPhoto();
		            resizeView();
	        	}else{
	        		layer.alert(data.err);
	        	}
	        }
	});
}
//重新绘制图片尺寸
function resizeView() {
	if($(".file-preview-image").width() > $(".file-preview-thumbnails").width()) {
		$(".file-preview-image").width($(".file-preview-thumbnails").width());
	}else{
		$(".file-preview-image").width("100%");
	}
}
$(window).bind('resize', function () {
	resizeView();
});

//删除图片
function delPhoto(t) {
	layer.confirm('确定执行？', function(index){
		$(t).parents(".file-preview-frame").remove();
		initPhoto();
	    layer.close(index);
	});
}

function initPhoto() {
	//上传张数上限操作
	$(".file-preview-thumbnails").each(function() {
		if($(this).attr("data-num") <= $(this).find(".file-preview-frame").length) {
			$(this).parents(".col-sm-10").find(".upload-btn").attr("disabled","disabled");
		}else{
			$(this).parents(".col-sm-10").find(".upload-btn").removeAttr("disabled");
		}
		if($(this).find(".file-preview-frame").length == 0) {
			$(this).parents(".file-preview").hide();
		}else{
			$(this).parents(".file-preview").show();
		}
	})
	//初始化图片相应表单属性
	$(".file-preview-thumbnails").each(function() {
		var localname = "";
		var url = "";
		$(this).find("img").each(function(index) {
			if(index == 0) {
				url += $(this).attr("rel");
				localname += $(this).attr("ref");
			}else{
				url += "|" + $(this).attr("rel");
				localname += "|" + $(this).attr("ref");
			}
		})
		$(this).parents(".col-sm-10").find(".localname").val(localname);
		$(this).parents(".col-sm-10").find(".head_picture").val(url);
	})
}

$(function(){
	$("#reset2").click();
	var index = parent.layer.getFrameIndex(window.name);
	var form = $(".form").Validform({
		tiptype:4,
		ajaxPost:true,
		callback:function(data){
			if(data.status == 1) {
				window.parent.layer.msg(data.info);
				window.parent.window.location.reload();
			}else{
				window.parent.layer.msg(data.info);
			}
			parent.layer.close(index);
		}
	});
	initType();
	$("input:radio[name=type]").change(function() {
		initTypeValue();
	})
	
	function initType(){
		if($("input:radio[name=type]:checked").val() == 1 || $("input:radio[name=type]:checked").val() == 4) {
			$(".url-box").hide();
			$(".url-box").find("input:text[name=url]").removeAttr("datatype");
			$(".url-box").find("input:text[name=url]").attr("disabled","disabled");
			
			$(".meetingplace-box").hide();
			$("#ambulance").removeAttr("datatype");
			$("#ambulance").attr("disabled","disabled");
		}else if($("input:radio[name=type]:checked").val() == 2){
			$(".url-box").show();
			$(".url-box").find("input:text[name=url]").attr("datatype","*");
			$(".url-box").find("input:text[name=url]").removeAttr("disabled");
			
			$(".meetingplace-box").hide();
			$("#ambulance").removeAttr("datatype");
			$("#ambulance").attr("disabled","disabled");
		}else if($("input:radio[name=type]:checked").val() == 3 || $("input:radio[name=type]:checked").val() == 5 || $("input:radio[name=type]:checked").val() == 6){
			$(".url-box").hide();
			$(".url-box").find("input:text[name=url]").removeAttr("datatype");
			$(".url-box").find("input:text[name=url]").attr("disabled","disabled");
			
			$(".meetingplace-box").show();
			$("#ambulance").attr("datatype","*");
			$("#ambulance").removeAttr("disabled");
		}
	}
	
	//初始化URL表单
	function initTypeValue() {
		if($("input:radio[name=type]:checked").val() == 1 || $("input:radio[name=type]:checked").val() == 4) {
			$(".url-box").hide();
			$("#url").val("");
			$("#url").removeAttr("datatype");
			$("#url").attr("disabled","disabled");
			
			$(".meetingplace-box").hide();
			$("#ambulance").val("");
			$("#ambulance").removeAttr("datatype");
			$("#ambulance").attr("disabled","disabled");
		}else if($("input:radio[name=type]:checked").val() == 2){
			$(".url-box").show();
			$("#url").val("");
			$("#url").attr("datatype","*");
			$("#url").removeAttr("disabled");
			
			$(".meetingplace-box").hide();
			$("#ambulance").val("");
			$("#ambulance").removeAttr("datatype");
			$("#ambulance").attr("disabled","disabled");
		}else if($("input:radio[name=type]:checked").val() == 3 || $("input:radio[name=type]:checked").val() == 5 || $("input:radio[name=type]:checked").val() == 6){
			$(".url-box").hide();
			$("#url").val("");
			$("#url").removeAttr("datatype");
			$("#url").attr("disabled","disabled");
			
			$(".meetingplace-box").show();
			$(".purchase-box").html("");
			$("#ambulance").val("");
			$("#ambulance").attr("datatype","*");
			$("#ambulance").removeAttr("disabled");
		}
	}
	
	$(".select-btn").click(function() {
		if($("input:radio[name=type]:checked").val() == 6){
			layerDialog("选择产品",'__URL__/product',"90%","90%",true);
		}else{
			layerDialog("选择会场",'__URL__/activity?type='+$("input:radio[name=type]:checked").val(),"90%","90%",true);	
		}
	})
})
function getPurchase(l){
	var html = "";
	var ids = "";
	var item = l.split("_");
	html += '<span ref="'+ item[0] +'" onclick="checkDel(this)">'+ item[1] +'<i class="fa fa-times"></i></span>';
	ids += item[0];
	$("#ambulance").val(ids);
	$(".purchase-box").html(html);
}
function checkDel(t){
	var ids = "";
	$(t).remove();
	$("#ambulance").val("");
}
</script>
</html>